<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
		<meta name="format-detection" content="telephone=no">
		<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/jquery.min.js{$Think.config.RESOURCE_VER}"></script>
		<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
		<script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/wx_share.js{$Think.config.RESOURCE_VER}"></script>
		<script src="{$Think.config.RESOURCEURL}wx_assets/js/util.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
		<link rel="stylesheet" type="text/css" href="{$Think.config.RESOURCEURL}wx_assets/css/product.css?v=201408281">
		<link rel="stylesheet" href="{$Think.config.RESOURCEURL}wx_assets/community/css/bootstrap.min.css{$Think.config.RESOURCE_VER}" />
		<title>优惠券</title>
	</head>
	<style>
	body
	{
		background:{$mallHue.mainColor||default='#f75493'};
		font-family: "微软雅黑";
		padding-bottom: 67px;
	}
	i
	{
		font-style: normal;
	}
		img
		{
			width: 100%;
		}
		.media.head
		{
			padding:20px 40px;
			text-align: center;
			position: relative;
		
		}
		.head img
		{
			border-radius: 50%;
			width: 60px;
			height: 60px;
		}
		.head .media-body
		{
			position: relative;
			text-align: left;
		}
		.coupon
		{
			padding: 15px 15px 5px 20px;
			width: 90%;
			margin: 0 auto;
			border-radius: 3px;
			background: white;
			box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
			position: relative;
			margin-bottom: 10px;
		}
		.coupon:after
		{
			content: '';
			display: block;
			position: absolute;
			width: 12px;
			height: 12px;
			border-radius: 50%;
			background: {$mallHue.mainColor||default='#f75493'};
			left: -6px;
			top: 50%;
			margin-top: -6px;
		}
		.coupon:before
		{
			content: '';
			display: block;
			position: absolute;
			width: 12px;
			height: 12px;
			border-radius: 50%;
			background: {$mallHue.mainColor||default='#f75493'};
			right: -6px;
			top: 50%;
			margin-top: -6px;
		}
		.coupon .media
		{
			border-bottom: 1px dashed #ddd;
		}
		.coupon .media.noborder
		{
			border: 0px;
		}
		.coupon .media-body h2
		{
			padding: 0px;
			margin-top: 0px;
			font-size: 18px;
			color: {$mallHue.fontColor||default='#f75493'};
		}
		.coupon .media-right
		{
			font-size: 50px;
			font-weight: 700;
			color: {$mallHue.fontColor||default='#f75493'};
		}
		.coupon .media-right i
		{
			font-size: 18px;
			position: relative;
			top: -4px;
			margin-right:2px;
		}
		.title
		{
			text-align: center;
			color: #faf99c;
			/*text-shadow: 0px 1px 1px #ff98c0;*/
			font-size: 16px;
			position: relative;
			width: 90%;
			margin: 20px auto;
			margin-bottom: 10px;
		}
		.title span
		{
			background: {$mallHue.mainColor||default='#f75493'};
			z-index: 1;
			position: relative;
			padding: 0px 10px;
		}
		.title .line
		{
			height: 1px;
			background: #faf99c;
			width: 100%;
			display: block;
			position: absolute;
			top: 50%;
			left: 0px;
			right: 0px;
			z-index: 0;
			padding: 0px;
			/*box-shadow: 0px 1px 1px #ff98c0;*/
		}
		.money
		{
			position: absolute;
			display: block;
			right: 0px;
			top: 50%;
			font-size: 14px;
			margin-top: -7px;
			color: #faf99c;
		}
		.receivelist
		{
			padding: 10px 10px 10px 0px !important;
			width: 90%;
			margin:0 auto;
			border-bottom: 1px dashed #ff86b5;
		}
		.box .receivelist:last-child
		{
			border: 0px;
		}
		.btnbox
		{
			
			padding: 10px 30px;
			background: rgba(0,0,0,0.4);
			text-align: center;
		}
		.btnbox > a
		{
			height: 45px;
			line-height: 45px;
		}
		.btnbox > a img
		{
			height: 45px;
		}
		.top
		{
			height: 45px;
			background: #f75493;
		}
		.top > .back
		{
			display: block;
			float: left;
			width: 45px;
			position: relative;
			height: 45px;
		}
		.top > .back img
		{
			position: absolute;
			left: 0px;
			right: 0px;
			margin: 0 auto;
			top: 50%;
			margin-top: -9px;
			width: 12px;
		}
		.btnbox
		{
			position: fixed;
			bottom: 0px;
			left: 0px;
			right: 0px;
			z-index: 999;
		}
	</style>
	<body>
		<!--<div class="top">
			<a href="javascript:history.go(-1);" class="back">
				<img src="{$Think.config.RESOURCEURL}wx_assets/images/product/arrow-left.png"/>
			</a>
		</div>-->
		<div class="main">
			<img src="{$schemeInfo.config.detailThemeImg}" alt="" />
				<div class="media head">
					<div class="media-left">
					    <img class="media-object" src="{$schemeInfo.headimgurl}" alt="">
					</div>
					<div class="media-body media-middle">
						<empty name="selfReceive">
							<p style="color: white;">{$schemeInfo.config.notReceived}</p>
							<else />
							<if condition="$received eq '0'">
								<p style="color: white;font-size: 16px;">我是{$schemeInfo.nickname}，</p>
								<p style="color: white;">{$schemeInfo.config.recommend}</p>
								<else/>
								<p style="color: white;font-size: 16px;">我是{$schemeInfo.nickname}，</p>
								<p style="color: white;">{$schemeInfo.config.receivedText}</p>
							</if>
						</empty>
						
					</div>
				</div>
				<empty name="selfReceive">
					<style>
						.coupon
						{
							padding-bottom: 15px;
						}
					</style>
				<div class="coupon">
					<img src="{$schemeInfo.config.notCouponImg}"/>
				</div>
				<else />
				<volist name="selfReceive" id="s">
					<div class="coupon">
						<div class="media <if condition='$s["isEffective"] eq 1'><else />noborder</if>">
							<div class="media-body  media-middle">
								<h2>{$s.name}</h2>
								<p style="color: #bebcbc;font-size: 12px;">{$s.recommend}</p>
							</div>
							<div class="media-right ">
								<i>¥</i>{$s['money'] | floatval}
							</div>
						</div>
						<if condition="$s['isEffective'] eq 1">
							<p style="margin: 0px;height: 33px;line-height: 33px;font-size: 12px;color: #999;">
								{$s['startTime']}至{$s.endTime}有效
							</p>
						</if>
					</div>
				</volist>
				<p style="text-align:center;margin: 20px;height: 33px;line-height: 33px;font-size: 14px;color: #faf99c;">红包已放入{$selfInfo.nickname}的账户</p>
				</empty>
				<if condition="$receiveList neq '' AND $schemeInfo.receiveType neq '1'">
					<div class="title">
						<span class="line"></span>
						<span>看朋友们的手气如何</span>
					</div>
					<div class="box">
						<volist name="receiveList" id="r">
						<div class="media head receivelist">
							<div class="media-left">
								<img class="media-object" src="{$r.headimgurl}" alt="">
							</div>
							<div class="media-body media-middle">
								<p style="color: white;font-size: 14px;">{$r.nickname}</p>
								<p style="color: white;font-size: 12px;">{$r.createTime}领取</p> 
							</div>
							 <span class="money">
									{$r.money}元
							   </span>
						</div>
						</volist>
					</div>
				</if>
				<div class="title">
					<span class="line"></span>
					<span>活动规则</span>
				</div>
				<div class="rule" style="width: 90%;margin:10px auto;color: white;">
					<p>
						{$schemeInfo.config.rule}
					</p>
				</div>
		</div>
		<if condition="$selfReceive neq ''">
		<div class="btnbox">
			<a href="{$schemeInfo.config.mallUrl}">
				<img src="{$schemeInfo.config.useBtn}" alt="" />
			</a>
		</div>
		</if>
	</body>
<script>
	wx_share.init({
				"title":'{$schemeInfo.shareTitle}',
				"desc":'{$schemeInfo.shareDescribe}',
				"link":'{$Think.config.SERVER_HOST}call.html?customerId={$customerId}&scope=1&module=product&method=receiveCoupon&params=%7B%22sendId%22:{$schemeInfo.sendId}%7D',
				"imgUrl":'{$schemeInfo.shareImg}'||'{$schemeInfo.headimgurl}',
				"pkg":{
					"appId": '{$pkg.appId}',
					"timestamp": {$pkg.timestamp},
				"nonceStr": '{$pkg.nonceStr}',
				"signature": '{$pkg.signature}'
			}
	});
</script>
</html>
